import React, { Component } from 'react';
import './Swiper.scss'
import {  Skeleton, Swiper } from 'antd-mobile'


class Index extends Component<any> {

    render() {
        // console.log(this.props.bannerList.length);       
        return (
            <div className='swiper'>
                <div className='swipe'>
                    {
                        this.props.bannerList&&this.props.bannerList.length !== 0 ?
                            <Swiper autoplay loop>
                                {
                                    this.props.bannerList.map((item: any, index: any) => {
                                        return (
                                            <Swiper.Item key={index}>
                                                <img src={item.img} alt="" />
                                            </Swiper.Item>
                                        )
                                    })
                                }
                            </Swiper> :
                            <>
                                <Skeleton.Title animated />
                                <Skeleton.Paragraph lineCount={4} animated />
                            </>
                    }
                </div>
            </div>
        );

    }
}

export default Index;